<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>读书</title>
    <style>
        div{
            /*border:  1px solid black;*/
            float: left;
        }
        #header{
            height: 20px;
            width: 100%;
        }
        #readingGood{
            margin-left: 12rem;
            float: left;
        }
        #logreg{
            float: right;
            margin-right: 12rem;
        }
        #category{
            width: 100%;
            height: 30px;
        }
        #footer{
            border: solid 1px black;
            height: 6rem;
            width: 100%;
            clear: both;
        }
        #body{
             width: 80%;
             margin-left: 9rem;
            height: 40rem;
        }
        #content{
            width: 100%;
            height: 30rem;
        }
        #dir{
            width: 20%;
            height: 30rem;
        }
        .oneDir{
            width: 100%;
            height: 2.8rem;
            float: left;
            border: solid 1px whitesmoke;
        }
        .oneDir td{
            float: left;
            margin-left: 30px;
        }
        #max{
            width: 79.6%;
            height: 30rem;
        }
        #book{
            border: 1px solid;
            width: 891px;
            height: 15rem;
            margin-left: 15px;
        }
        #book1{
            width: 40%;
            margin-left: 50px;
            margin-top: 25px;
            height: 12rem;
        }
        #book2{
            width: 45%;
            margin-left: 50px;
            margin-top: 25px;
            height: 12rem;
        }
    </style>
</head>
<body>
<header id="header">
    <a id="readingGood" href="https://i.chaoxing.com/">读书好，好读书，读好书!</a>
    <div id="logreg"> <a href="#" id="login">登录</a>|<a href="#" id="register">注册</a></div>
</header>
<hr>
<div id="body">
    <div id="meunBar">
     <img src="img/images/top.png" width="100%" height="100px">
    </div>
    <div id="category">
         <table  style="width: 100% ;background-color: whitesmoke">
             <tr style="text-align: center">
                 <td><a href="#">首页</a></td>
                 <td><a href="#">资讯</a></td>
                 <td><a href="#">哲学/古籍</a></td>
                 <td><a href="#">出版图书</a></td>
                 <td><a href="#">电子书</a></td>
                 <td><a href="#">网络小说</a></td>
                 <td><a href="#">在线读书</a></td>
                 <td><a href="#">读书导航</a></td>
             </tr>
         </table>
    </div>
    <div id="content">
          <div id="dir">
               <table style="width: 100%;">
                   <tr class=oneDir><td><img src="img/images/bk.png"><a href="#">小说作品</a></td></tr>
                   <tr class=oneDir><td><img src="img/images/bk.png"><a href="#">小说作品</a></td></tr>
                   <tr class=oneDir><td><img src="img/images/bk.png"><a href="#">小说作品</a></td></tr>
                   <tr class=oneDir><td><img src="img/images/bk.png"><a href="#">小说作品</a></td></tr>
                   <tr class=oneDir><td><img src="img/images/bk.png"><a href="#">小说作品</a></td></tr>
                   <tr class=oneDir><td><img src="img/images/bk.png"><a href="#">小说作品</a></td></tr>
                   <tr class=oneDir><td><img src="img/images/bk.png"><a href="#">小说作品</a></td></tr>
                   <tr class=oneDir><td><img src="img/images/bk.png"><a href="#">小说作品</a></td></tr>
                   <tr class=oneDir><td><img src="img/images/bk.png"><a href="#">小说作品</a></td></tr>
                   <tr class=oneDir><td><img src="img/images/bk.png"><a href="#">小说作品</a></td></tr>
               </table>
          </div>
          <div id="max">
               <img src="img/images/yuedu.jpg" width="891"style="margin-left: 15px">
              <p><b style="margin-left: 15px">最近更新</b></p>
              <div id="book">
                   <div id="book1">
                        <img src="img/images/pic_1.jpg" style="float: left;margin-top: 10px">
                       <h5>多少黑名单&nbsp;曾互道晚安</h5>

                       <p style="font-size: 9px;color: gray">风篮子&nbsp;著</p>
                       <p style="font-size: 9px;color: gray">啊发哦沉默啊流口水的女看来你是考虑，数据库的女会计</p>
                   </div>
                  <div id="book2">
                      <img src="img/images/pic_2.jpg" style="float: left;margin-top: 10px">
                      <h5>多少黑名单&nbsp;曾互道晚安</h5>

                      <p style="font-size: 9px;color: gray">风篮子&nbsp;著</p>
                      <p style="font-size: 9px;color: gray">啊发哦沉默啊流口水的女看来你是考虑，数据库的女会计</p>
                  </div>
              </div>
          </div>

    </div>
</div>
<footer id="footer">
    <center>
    <font color="gray" size="2">关于读书 免费声明 读书目录 联系我们
        <br>Copyright&copy; 读书网 2005-2019, All Rights Reserved 版权所有
        <br>苏ICP备16007882<img src="img/images/beian.png">公安安备4202号
    </font>

    </center>
    
</footer>
</body>
</html>